To "mobilize' an MVC4 site

1. Run Install-Package jQuery.Mobile.MVC
within your app to 'mobilize it'

Add this code to the global.asax.cs

BundleMobileConfig.RegisterBundles(BundleTable.Bundles);

2. Add a media query to the css

@media only screen and (max-width: 850px) {

for orientation:

@media only screen and (device-width: 768px) and (orientation: landscape) {
  /* rules for small device in landscape orientation */
}
 

for resolution (retina) displays

-webkit-device-pixel-ratio media query:

3. Add a view port meta tag to the _Layout page

<meta name="viewport" content="width=device-width" />

4. Add a new layout file _Layout.Mobile.cshtml

Sites to help with mobile

http://view.jquerymobile.com/master/demos/

http://the-jquerymobile-tutorial.org/